DeepWiki

01.b - Key-Components

Relevant source files

This page provides an overview of the major system components in godeep.wiki, identifying the key frontend pages, backend APIs, automation scripts, and UI building blocks that compose the application. Each component is mapped to its corresponding code entities (files, routes, functions) to enable quick navigation to implementation details.

For detailed information about the overall architecture and system flow, see System Architecture. For implementation details of specific subsystems, refer to their dedicated sections: User Journey, Authentication & GitHub Integration, Payment Processing, Automation System, and Admin Panel.

The system consists of five primary component categories:

CategoryComponentPrimary File(s)Purpose
User-Facing PagesLanding Pageapp/page.tsxPayment CTA and product description
Success Pageapp/success/page.tsxPost-payment GitHub connection prompt
Thank You Pageapp/thank-you/page.tsxConfirmation and delivery timeline
Dashboardapp/dashboard/page.tsxUser's connected repositories view
Payment SystemCheckout Actionapp/actions.tsStripe checkout session creation
Webhook Handlerapp/api/webhooks/stripe/route.tsPayment event processing
AuthenticationOAuth Initiationapp/api/auth/github/route.tsGitHub OAuth flow start
OAuth Callbackapp/api/auth/github/callback/route.tsToken exchange and installation logging
Admin InterfaceAdmin Panelapp/admin/page.tsxPassword-protected token generator
Token APIapp/api/admin/generate-token/route.tsInstallation access token generation
Automationntfy Automation Scriptscripts/ntfy-godeep-automation.shRepository cloning pipeline
Remote Variantscripts/ntfy-godeep-automation-remote.shAlternative automation script
UI ComponentsBeamButtoncomponents/beam-button.tsxAnimated CTA button
SpotlightCardcomponents/spotlight-card.tsxInteractive card with spotlight effect
IconGlowcomponents/icon-glow.tsxIcon wrapper with glow animation

Sources: app/page.tsx

CLAUDE.md L31-L43

CLAUDE.md L54-L66

The following diagram maps system components to their code locations and shows the data flow between them:

Component Relationships Diagram

This diagram shows how code entities interact across the system lifecycle. The createCheckoutSession() function initiates the payment flow, while the OAuthCallback route bridges payment to repository access through cookie-based session management. The automation script monitors ntfy.sh for both payment and installation events, then uses the TokenAPI to clone customer repositories.

Sources: app/page.tsx L62-L66

app/actions.ts

CLAUDE.md L33-L43

scripts/ntfy-godeep-automation.sh L6-L8

Landing Page (app/page.tsx)Link copied!

The landing page is the entry point for all users, built as a Next.js Server Component with the following structure:

Key Elements:

Component Hierarchy:

Landing Page Component Structure

Sources: app/page.tsx L12-L213

app/page.tsx L62-L66

components/beam-button.tsx

components/spotlight-card.tsx

These pages handle post-payment flow:

  • Success Page (app/success/page.tsx): Receives session_id from Stripe redirect, displays GitHub connection prompt with session_id embedded in OAuth URL
  • Thank You Page (app/thank-you/page.tsx): Final confirmation page with 1-9 hour delivery expectation message

Sources: CLAUDE.md L34-L42

CLAUDE.md L46-L65

The user-facing dashboard displays repositories connected through GitHub OAuth:

  • Location: app/dashboard/page.tsx
  • Authentication: Uses user OAuth token stored in httpOnly cookie
  • Purpose: Shows user's own repositories (NOT customer repositories accessible via installation tokens)
  • Token Type: User access token with 24-hour expiry

Sources: CLAUDE.md L59

CLAUDE.md L63-L66

createCheckoutSession Server Action

Location: app/actions.ts

Server action that creates Stripe checkout sessions:

  • Product: "DeepWiki Analysis" priced at $10
  • Success URL: /success?session_id={CHECKOUT_SESSION_ID}
  • Cancel URL: / (landing page)
  • Mode: payment (one-time payment)

createCheckoutSession Flow

Sources: app/actions.ts

CLAUDE.md L84

Stripe Webhook Handler

Endpoint: POST /api/webhooks/stripe Location: app/api/webhooks/stripe/route.ts

Processes checkout.session.completed events:

  1. Verifies webhook signature using STRIPE_WEBHOOK_SECRET
  2. Extracts session data (session_id, customer_email)
  3. Sends notification to ntfy.sh topic with payment details

Sources: CLAUDE.md L153-L162

OAuth Initiation (/api/auth/github)

Endpoint: GET /api/auth/github Location: app/api/auth/github/route.ts

Initiates GitHub OAuth flow:

  1. Generates CSRF state token using crypto.randomUUID()
  2. Stores state in github_oauth_state cookie (1-hour expiry)
  3. Stores session_id (if provided) in stripe_session_id cookie (1-hour expiry)
  4. Redirects to GitHub App installation URL with state parameter

URL Parameters Accepted:

  • session_id: Optional Stripe session ID for payment-to-installation linking

Sources: CLAUDE.md L56-L57

CLAUDE.md L48-L49

OAuth Callback (/api/auth/github/callback)

Endpoint: GET /api/auth/github/callback Location: app/api/auth/github/callback/route.ts

Handles GitHub OAuth callback:

  1. Validates state parameter against cookie
  2. Exchanges authorization code for user access token
  3. Fetches user profile data (username, email, name)
  4. Retrieves session_id from stripe_session_id cookie
  5. Logs complete installation details to Vercel logs
  6. Sends notification to ntfy.sh with installation_id
  7. Stores user token in github_token cookie (24-hour expiry)
  8. Redirects to /thank-you page

Critical Logging Output:

GitHub Installation: {
  session_id: "cs_test_...",
  installation_id: "12345678",
  username: "user",
  email: "user@example.com",
  timestamp: "ISO timestamp"
}

Sources: CLAUDE.md L58-L65

app/api/auth/github/callback/route.ts

Location: app/admin/page.tsx

Client-side React component with three states:

StateDescriptionUI Elements
UnauthenticatedPassword login formPassword input, Login button app/admin/page.tsx L100-L136
AuthenticatedToken generator interfaceInstallation ID input, Customer Email input (optional), Generate button app/admin/page.tsx L139-L215
Token GeneratedToken display with usage instructionsToken display, Clone commands, Repository list app/admin/page.tsx L217-L359

Authentication Flow:

Admin Panel State Management

Key Features:

Sources: app/admin/page.tsx L12-L363

CLAUDE.md L170-L184

Endpoint: POST /api/admin/generate-token Location: app/api/admin/generate-token/route.ts

Generates installation access tokens for repository access:

Request Body:

{  "installationId": "12345678",  "password": "ADMIN_PASSWORD"}

Response:

{  "token": "ghs_...",  "expiresAt": "ISO timestamp",  "repositories": [...],  "user": {    "username": "customer",    "email": "customer@example.com",    "name": "Customer Name"  }}

Implementation:

  1. Verifies password matches process.env.ADMIN_PASSWORD
  2. Calls getInstallationAccessToken(installationId) from lib/github-app.ts
  3. Calls getInstallationRepositories(installationId) to fetch accessible repos
  4. Returns token with 1-hour expiry (GitHub App limitation)

Sources: app/api/admin/generate-token/route.ts

CLAUDE.md L72-L79

lib/github-app.ts

Location: scripts/ntfy-godeep-automation.sh

Bash script that subscribes to ntfy.sh notifications and automates repository cloning:

Configuration Variables:

Pipeline Stages:

Automation Script Pipeline

Key Operations:

  1. Installation ID Extraction: Uses grep to parse "Installation ID: 12345678" from message scripts/ntfy-godeep-automation.sh L53
  2. Token Generation: Calls admin API with installation_id and ADMIN_PASSWORD scripts/ntfy-godeep-automation.sh L63-L65
  3. Repository Cloning: Uses token as x-access-token in git URL scripts/ntfy-godeep-automation.sh L90
  4. Repository Naming: Formats as {email_prefix}-{repo_name} scripts/ntfy-godeep-automation.sh L79-L84
  5. Private Repo Creation: Uses GitHub CLI (gh) to create private repo scripts/ntfy-godeep-automation.sh L106
  6. Cleanup: Deletes local clone to save disk space scripts/ntfy-godeep-automation.sh L114

macOS Integration:

Sources: scripts/ntfy-godeep-automation.sh L1-L152

CLAUDE.md L5

CLAUDE.md L5

Location: scripts/ntfy-godeep-automation-remote.sh

Alternative version of automation script with similar functionality but designed for remote server deployment. Shares same core logic as local version.

Sources: scripts/ntfy-godeep-automation-remote.sh

The system uses three custom UI components for enhanced user experience:

ComponentFilePurposeKey Feature
BeamButtoncomponents/beam-button.tsxPrimary CTA buttonsAnimated gradient glow on hover components/beam-button.tsx L13
SpotlightCardcomponents/spotlight-card.tsxFeature display cardsMouse-tracking spotlight effect components/spotlight-card.tsx L15-L20
IconGlowcomponents/icon-glow.tsxIcon containersRadial glow effect on hover components/icon-glow.tsx L13

Wraps shadcn/ui <Button> with gradient animation:

Visual Effects:

Usage in Landing Page:

<BeamButton size="lg" type="submit">  Generate DeepWiki — $10</BeamButton>

Sources: components/beam-button.tsx L1-L26

app/page.tsx L63-L65

Mouse-tracking card with radial gradient spotlight:

Effect Implementation:

Usage in Landing Page:

Sources: components/spotlight-card.tsx L1-L68

app/page.tsx L107-L125

Simple container for icons with hover glow:

Structure:

Usage:

Sources: components/icon-glow.tsx L1-L19

app/page.tsx L74-L78

The following table shows how components interact across the system:

User ActionFrontend ComponentServer Action/APIExternal ServiceAutomation
Pay $10app/page.tsx BeamButtoncreateCheckoutSessionStripe API-
Payment complete-POST /api/webhooks/stripentfy.shScript triggered
Connect GitHubapp/success/page.tsxGET /api/auth/githubGitHub OAuth-
Authorize app-GET /api/auth/github/callbackGitHub API + ntfy.shScript triggered
Generate tokenapp/admin/page.tsxPOST /api/admin/generate-tokenGitHub App API-
View reposapp/dashboard/page.tsxUser OAuth tokenGitHub API-

Sources: CLAUDE.md L33-L43

app/page.tsx

app/admin/page.tsx

scripts/ntfy-godeep-automation.sh

Refresh this wiki

Last indexed: 23 November 2025 (922b35)

On this page

Ask Devin about godeep.wiki-jb

01.b - Key-Components | DeepWiki | godeep.wiki